// 引入公共头
$(function () {
    $('.header-common').load('../pages/header.html')
})
// 引入公共脚
$(function () {
    $('.footer-common').load('../pages/footer.html')
})

let stateAll = false
let carts = []
/**
 * 显示购物车列表
 */
function showCartList() {
    // 1. 从localstorage中获取购物车商品数据
    let products = JSON.parse(localStorage.getItem('products'))
    // let stateAll = false //全选状态

    let str = `<tr>
            <td><input type="checkbox" class="checkbox-all" ${stateAll ? 'checked' : ''}></td>
           
            <th>商品图片</th>
            <th>商品名称</th>
            <th>单价</th>
            <th>数量</th>
            <th>总价</th>
            <th>操作</th>
        </tr>
        `
    products.forEach(item => {
        item.singlePrice = (item.cartNum * item.detail.price).toFixed(2)

        let itemStr = `
                <tr>
                    <td><input goodsId="${item.detail.id}" type="checkbox" class="checkbox-item" ${item.state ? 'checked' : ''}></td>
                    
                    <td><img src="${item.share.imageUrl}" alt="shop03" width="50" height=""></td>
                    <td>${item.detail.title}</td>
                    <td>￥${item.detail.price}</td>
                    <td><input type="button" name="minus" value="-" ${item.cartNum == 0 ? 'disabled' : ''} >
                    <input type="text" name="amount"  value="${item.cartNum}"><input type="button" name="plus" value="+"></td>
                    <td class="singleprice" width="100px">￥${item.singlePrice}</td>
                    <td><a class="delete-btn" href="#">删除</a></td>
                </tr>
            `
        str += itemStr
    })

    $('table').html(str)
    AllPrice()
    localStorage.setItem('products', JSON.stringify(products))
}
showCartList()

/**
 * 点击去首页
 */
function toIndex() {
    $('.nav li').click(() => { location.href = './index.html' })
}

/**
 * 全选
 */
function checkedAction() {
    // 刷新取消所有勾选
    let products = JSON.parse(localStorage.getItem('products'))
    products.forEach(item => {
        item.state = false
    })
    localStorage.setItem('products', JSON.stringify(products))
    // 全选
    $('table').on('click', '.checkbox-all', () => {
        stateAll = !stateAll
        let products = JSON.parse(localStorage.getItem('products'))
        products.forEach(item => {
            item.state = stateAll
        })
        localStorage.setItem('products', JSON.stringify(products))
        AllPrice()
        showCartList()
    })
    // 单选
    $('table').on('click', '.checkbox-item', function (e) {
        let products = JSON.parse(localStorage.getItem('products'))

        let id = $(this).attr('goodsId')
        let goods = products.find(item => item.detail.id == id)

        goods.state = !goods.state
        stateAll = products.every(item => item.state == true)

        localStorage.setItem('products', JSON.stringify(products))
        AllPrice()
        showCartList()
    })
}
checkedAction()
/**
 * 商品操作
 */
function cartsAction() {
    // 数量加一
    $('table').on('click', 'input[name="plus"]', function () {
        let products = JSON.parse(localStorage.getItem('products'))

        let id = $(this).parent().parent().children().children().attr('goodsId')
        let goods = products.find(item => item.detail.id == id)
        goods.cartNum++

        localStorage.setItem('products', JSON.stringify(products))
        AllPrice()
        showCartList()
    })
    // 数量减一
    $('table').on('click', 'input[name="minus"]', function () {
        let products = JSON.parse(localStorage.getItem('products'))

        let id = $(this).parent().parent().children().children().attr('goodsId')
        console.log(id)
        let goods = products.find(item => item.detail.id == id)
        goods.cartNum--

        localStorage.setItem('products', JSON.stringify(products))
        AllPrice()
        showCartList()
    })
    // 删除商品
    $('table').on('click', '.delete-btn', function () {
        let products = JSON.parse(localStorage.getItem('products'))

        let id = $(this).parent().parent().children().children().attr('goodsId')
        let index = products.findIndex(item => item.detail.id == id)

        products.splice(index,1)
        localStorage.setItem('products', JSON.stringify(products))
        AllPrice()
        showCartList()
    })

}
cartsAction()

/**
 * 计算所有商品的总价
 */
function AllPrice() {
    let products = localStorage.getItem('products')
    carts = JSON.parse(products)
    let sum = 0
    carts.forEach(item => {
        if (item.state == true) {
            let goodsPrice = item.singlePrice
            sum += goodsPrice * 1
        }
    })
    $('.totalPrice').html(sum.toFixed(2))
}

/**
 * 返回顶部
 */
 window.onscroll = function () {
    toTop()
}
function toTop() {
    if (document.body.scrollTop >= 600 || document.documentElement.scrollTop >= 600) {
        $('.toTop').css('display', 'block')
    } else if (document.body.scrollTop < 600 || document.documentElement.scrollTop < 600) {
        $('.toTop').css('display', 'none')
    }

    $('.toTop').click(function () {
        document.body.scrollTop = 0
        document.documentElement.scrollTop = 0
    })
}

